<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="index.css">
</head>

<body>
    <div class="header">
        <div class="nav">
            <div class="logo">
            </div>
            <ul>
                <li>
                    <p>游戏资料</p>
                    <span>DATA</span>
                    <div class="layout">
                        <ul>
                            <li>
                                <a href="">版本介绍</a>
                                <a href="">游戏介绍</a>
                                <a href="">英雄资料</a>
                                <a href=""><span class="redN"></span>爆料站</a>
                                <a href=""><span class="redN"></span>故事站</a>
                                <a href="">游戏壁纸</a>
                            </li>
                            <li>
                                <a href="">攻略中心</a>
                                <a href="">英雄攻略</a>
                                <a href="">视频中心</a>
                                <a href=""><span class="redN"></span>开放素材库</a>
                                <a href="">王者视角</a>
                                <a href="">作者入住</a>
                                <a href="">媒体入驻</a>
                            </li>
                            <li>
                                <a href=""><span class="redH"></span>冬季冠军杯</a>
                                <a href=""><span class="redH"></span>KPL</a>
                                <a href=""><span class="redH"></span>全国大赛</a>
                                <a href="">模拟战大师赛</a>
                                <a href=""><span class="redN"></span>K甲联赛</a>
                                <a href="">高校赛</a>
                                <a href="">全民赛</a>
                                <a href=""><span class="redN"></span>赛事数据</a>
                            </li>
                            <li>
                                <a href="">荣耀传承</a>
                                <a href="">王者文化站</a>
                                <a href="">王者音乐听</a>
                                <a href="">万千世界</a>
                                <a href="">星光殿堂</a>
                                <a href="">商户特权</a>
                                <a href=""><span class="redN"></span>IP共创计划</a>
                            </li>
                            <li>
                                <a href=""><span class="redN"></span>创意互动营</a>
                                <a href=""><span class="redN"></span>王者营地</a>
                                <a href="">手Q部落</a>
                                <a href="">微信圈子</a>
                                <a href="">官方微博</a>
                                <a href="">微信公众号</a>
                                <a href="">手Q订阅号</a>
                            </li>
                            <li>
                                <a href=""><span class="green"></span>成长守护平台</a>
                                <a href=""><span class="redN"></span>对局环境情报站</a>
                                <a href="">客服专区</a>
                                <a href="">礼包兑换</a>
                                <a href="">自助服务</a>
                            </li>
                            <li>
                                <a href=""><span class="redN"></span>代号破晓</a>
                                <a href=""><span class="redN"></span>代号启程</a>
                            </li>
                        </ul>
                    </div>
                </li>
                <li>
                    <p>内容中心</p>
                    <span>CONTENTS</span>
                </li>
                <li>
                    <p>赛事中心</p>
                    <span>MATCH</span>
                </li>
                <li>
                    <p>百态王者</p>
                    <span>CULTURE</span>
                </li>
                <li>
                    <p>社区互动</p>
                    <span>COMMUNITY</span>
                </li>
                <li>
                    <p>玩家支持</p>
                    <span>PLATER</span>
                </li>
                <li>
                    <p>IP新游 </p>
                    <span>NEW GANES</span>
                </li>
                <li>
                    <img src="images/nav_search.png" alt="">
                </li>
            </ul>
            <div class="search">
                <img src="images/index.png" alt="">
                <a href="">欢迎登录</a>
                <p>登录后查看游戏战绩</p>

            </div>


        </div>

    </div>
    <div class="main">
        <div class="main-left">
            <img src="images/main.png" alt="">
            <div class="main-nav">
                <a href="">曜李逍遥皮肤</a>
                <a href="">KPL季后赛赛程</a>
                <a href="">赛事队伍增补公告</a>
                <a href="">节奏型打野教学</a>
                <a href="">峡谷逍遥哥哥</a>

            </div>
        </div>
        <div class="main-center">
            <div class="main-center-header">
                <span>热门</span>
                <span>新闻</span>
                <span>公告</span>
                <span>活动</span>
                <span>赛事</span>
                <span>...</span>

            </div>
            <h2>6月2日体验服停机更新公告</h2>
            <ul>
                <li>
                    <span>公告</span>
                    <p>6月2日体验服停机更新公告</p>
                    <span>06/01</span>
                </li>
                <li>
                    <span>公告</span>
                    <p>6月2日体验服停机更新公告更新公告</p>
                    <span>06/01</span>
                </li>
                <li>
                    <span>公告</span>
                    <p>6月2日体验服停机更新公告</p>
                    <span>06/01</span>
                </li>
                <li>
                    <span>公告</span>
                    <p>6月2日体验服停机更新公告更新公告</p>
                    <span>06/01</span>
                </li>
                <li>
                    <span>公告</span>
                    <p>6月2日体验服停机更新公告</p>
                    <span>06/01</span>
                </li>
                <li>
                    <span>公告</span>
                    <p>6月2日体验服停机更新公告更新公告</p>
                    <span>06/01</span>
                </li>
                <li>
                    <span>公告</span>
                    <p>6月2日体验服停机更新公告</p>
                    <span>06/01</span>
                </li>
            </ul>
        </div>
        <div class="main-right">

        </div>

    </div>
    <div class="dj">
        <img src="images/r_dj.png" alt="">
    </div>

</body>

</html>